<template>
  <el-tooltip class="item" effect="dark" content="操作帮助" placement="top">
    <img
      :src="imgUrl + '/profile/personinfo/2023/9/25/help_b7d630f8923d4e4b87662a2a520d61ca.png'"
      class="help-icon pointer"
      v-show="show"
      @click="handleInfo"
    />
  </el-tooltip>
</template>

<script>
import helpApi from '@/api/system/help'
import { getHttpURL } from '@/utils/fileUtils'

export default {
  data() {
    return {
      imgUrl: process.env.VUE_APP_IMG_API,
      show: false,
      fileUrl: ''
    }
  },
  created() {
    this.getShow()
  },
  methods: {
    getShow() {
      helpApi.helpDetail({ helpKey: this.$route.path }).then((res) => {
        if (res.data) {
          this.show = true
          this.fileUrl = res.data.fileUrl
        }
      })
    },
    handleInfo() {
      window.open(getHttpURL(this.fileUrl), '_blank')
    }
  }
}
</script>

<style lang="scss" scoped>
.help-icon {
  width: 30px;
  vertical-align: middle;
  margin-left: 10px;
  margin-bottom: 5px;
}
</style>
